// common
#app{
    height: 100vh;
}

// drag
#drag {
    user-select: none;
    width: 350px;
    height: 400px;
    border: 1px solid #ccc;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;

    ul {
        display: flex;
        justify-content: space-between;
        align-items: stretch;
        flex-wrap: wrap;

        >li {
            margin: 5px;
            background: skyblue;
            width: 100px;
            height: 100px;
            list-style: none;

        }
    }
}
// echarts
.echart{
    width:360px;
    height:360px;
}
//bilibili
    .center{
        margin: 0 auto;
        width: 1140px;
        display: flex;
        justify-content: space-between;
        flex-direction: column;
        align-items: center;
        height: 100%;
    }
    #index{
        height: 100%;
    }
   
    #ul{
        position: absolute;
        top: 0;
        left: 0;
        z-index: 99;
        top: 30px;
        background: skyblue;
        padding: 10px;
    }
  
     .demo-tabs {
        > .el-tabs__content {
            padding: 32px;
            color: #6b778c;
            font-size: 32px;
            font-weight: 600;
          }
          .custom-tabs-label {
            .el-icon {
                vertical-align: middle;
              }
              span {
                vertical-align: middle;
                margin-left: 4px;
              }
          }
     }
 